<template>
	<view class="">
		<u-tabbar :value="value" @change="change" inactiveColor='#909090 ' activeColor="#2A71C0 " zIndex='999'>
			<u-tabbar-item :text="item.name" :name='item.id' v-for="(item,index) in menu_list" :key="item.id">
				<image :class="['imag']" slot="active-icon" :src="item.imagea"></image>
				<image :class="['imag']" slot="inactive-icon" :src="item.image"></image>
			</u-tabbar-item>
		</u-tabbar>

		<!--使用   <tabbar value="0"></tabbar>	-->
	</view>
</template>

<script>
	import {
		mapGetters,
		mapState
	} from 'vuex';
	export default {
		props: {
			value: {
				type: Number,
				default: 1,
			}
		},
		data() {
			return {
				list1: [{ //用户端
						id: 1,
						name: '首页',
						url: '/pages/share/index/index',
						image: require('../../static/tabbar/index.png'),
						imagea: require('../../static/tabbar/indexa.png')
					},
					{
						id: 2,
						name: '分类',
						url: '/pages/share/classify/classify',
						image: require('../../static/tabbar/classify.png'),
						imagea: require('../../static/tabbar/classifya.png')
					},
					{
						id: 3,
						name: '订单',
						url: '/pages/share/order/order',
						image: require('../../static/tabbar/order.png'),
						imagea: require('../../static/tabbar/ordera.png')
					},
					{
						id: 5,
						name: '我的',
						url: '/pages/share/my/my',
						image: require('../../static/tabbar/my.png'),
						imagea: require('../../static/tabbar/mya.png')
					}
				],
				list2: [{ //服务端
						id: 1,
						name: '首页',
						url: '/pages/share/index/index',
						image: require('../../static/tabbar/index.png'),
						imagea: require('../../static/tabbar/indexa.png')
					},
					{
						id: 3,
						name: '清洗订单',
						url: '/pages/share/order/order',
						image: require('../../static/tabbar/order.png'),
						imagea: require('../../static/tabbar/ordera.png')
					},
					{
						id: 5,
						name: '取回订单',
						url: '/pages/share/my/my',
						image: require('../../static/tabbar/serverMy.png'),
						imagea: require('../../static/tabbar/serverMya.png')
					}
				],
				list3: [{ //取货员端
						id: 1,
						name: '任务大厅',
						url: '/pages/share/index/index',
						image: require('../../static/tabbar/index.png'),
						imagea: require('../../static/tabbar/indexa.png')
					},
					{
						id: 4,
						name: '订单地图',
						url: '/pages/share/orderMap/orderMap',
						image: require('../../static/tabbar/order.png'),
						imagea: require('../../static/tabbar/ordera.png')
					},
					{
						id: 5,
						name: '我的',
						url: '/pages/share/my/my',
						image: require('../../static/tabbar/my.png'),
						imagea: require('../../static/tabbar/mya.png')
					}
				],
				list4: [{ //入库员端
						id: 1,
						name: '订单中心',
						url: '/pages/share/index/index',
						image: require('../../static/tabbar/index.png'),
						imagea: require('../../static/tabbar/indexa.png')
					},
					{
						id: 5,
						name: '我的',
						url: '/pages/share/my/my',
						image: require('../../static/tabbar/my.png'),
						imagea: require('../../static/tabbar/mya.png')
					}
				]
			}
		},

		methods: {
			change(e) {
				this.menu_list.map(item => {
					if (e == 5) {
						if (!this.token) {
							uni.navigateTo({
								url: '/pages/share/login/login'
							})
							return
						}
					}
					if (item.id == e) {
						uni.switchTab({
							url: item.url
						})
					}
				})
			},

		},
		computed: {
			menu_list() { //根据身份展示不同的菜单栏
				let list = []
				let identity = this.$store.state.identity
				if (identity == 1) {
					list = this.list1
				} else if (identity == 2) {
					list = this.list2
				} else if (identity == 3) {
					list = this.list3
				} else if (identity == 4) {
					list = this.list4
				}
				return list
			},
			...mapState({
				token: state => state.token,
			})
		},
		watch: {

		},
	}
</script>

<style lang="scss" scoped>
	.imag {
		width: 40upx;
		height: 40upx;
	}

	.imag2 {
		width: 34upx;
	}
</style>
